import React, { useEffect, useState } from "react"
import styles from "./interviewManage.less"
import { Table, Input, Switch  } from "antd"
import { SearchOutlined } from '@ant-design/icons';
import { IinterviewManageTableItem, ISkillListQuery } from "@/utils/interface"
import { getInterviewManageList } from "@/services"
import useStore from "@/context/useStore"
import { observer } from "mobx-react-lite"
import { Link ,history} from "umi";

const isStatus = ['不确定','通过','没通过']
const isSoundrecord=['无','有']
const isShield=['false','true']

// function godetail(id:string){
//     console.log(id);
//     console.log(history);
//     history.replace(`/teachers/interviewRecord?interviewId=${id}&shield=true&see=true`)
// }

const columns = [
    {
        title: '岗位名称',
        // dataIndex: 'stationName',
        render: (row: IinterviewManageTableItem) => <Link to="/teachers/interviewRecord?interviewId=${row.interviewId}&shield=true&see=true" >{row.stationName}</Link>,
        align: "center",
    },
    {
        title: '公司名称',
        dataIndex: 'companyName',
        align: "center",
    },
    {
        title: '面试时间',
        dataIndex: 'interviewTime',
        align: "center",
    },
    {
        title: '面试官',
        dataIndex: 'intervierManagement',
        align: "center",
    },
    {
        title: '专业',
        dataIndex: 'majorName',
        align: "center",
    },
    {
        title: '提交人',
        dataIndex: 'commitName',
        align: "center",
    },
    {
        title: '面试结果',
        // dataIndex: 'status',
        align: "center",
        render: (row: IinterviewManageTableItem) => <span className={styles[`status${row.status}`]}>{isStatus[Number(row.status)]}</span>,
    },
    {
        title: '录音文件',
        // dataIndex: 'issoundrecord',
        align: "center",
        render: (row: IinterviewManageTableItem) => <span className={styles[`issoundrecord${row.status}`]}>{isSoundrecord[Number(row.issoundrecord)]}</span>,
    },
    {
        title: '屏蔽',
        // dataIndex: 'shield',
        align: "center",
        render: (row: IinterviewManageTableItem) => <Switch defaultChecked className={styles[`shield${row.shield}`]}></Switch>
    },
];

const InterviewManage: React.FC = () => {
    let [title, setTitle] = useState('');
    let [searchTitle, setSearchTitle] = useState('');
    let [dataSource, setDataSource] = useState()

    let [curSkill, setCurSkill] = useState('')
    let [curStatus, setCurStatus] = useState(0)
    let [isMyInfo, setMyInfo] = useState(false);
    let queryParams: ISkillListQuery = { isAsc: 'desc', searchTitle: '', pageNum: 1, pageSize: 10, isMyInfo: false };

    let { skill } = useStore()

    //发起请求  获取专业标签
    useEffect(() => {
        skill.getSkillLabel()
    }, [])

    //发起请求  获取项目列表
    useEffect(() => {
        let newqueryParams: ISkillListQuery = {} as ISkillListQuery
        //拼接参数
        if (curStatus) {
            newqueryParams = { ...queryParams, majorId: curSkill, status: curStatus }
        } else {
            newqueryParams = { ...queryParams, majorId: curSkill, status: '' as unknown as number }
        }
        if (searchTitle) {
            newqueryParams = { ...queryParams, searchTitle }
        }
        getInterviewManageList(newqueryParams).then(res => {
            // console.log('res', res);
            if (res.code == 200) {
                // console.log(res.rows);
                setDataSource(res.rows)
            }
        })
    }, [curSkill, curStatus, isMyInfo, searchTitle]);

    return <div className={styles.interviewmanage}>
        <div className={styles.interview}>
            <div>
                <div>
                    <Input placeholder="搜索岗位/公司名称" suffix={<SearchOutlined onClick={() => { setSearchTitle(title) }} />} value={title} onChange={e => setTitle(e.target.value)} onKeyDown={e => {
                        if (e.keyCode === 13) {
                            setSearchTitle(title)
                        }
                    }} />
                </div>
                <Table className={styles.tables} rowKey='interviewId' dataSource={dataSource} columns={columns as any} />
            </div>
        </div>
    </div>
}

export default observer(InterviewManage)